<template>
  <div class="app-user">
   
  </div>
</template>

<script setup name="user">
import { getListApi } from "@/api/menu";
const { proxy } = getCurrentInstance()
const tableData = ref([])
const total = ref(0)
const tableLoading = ref(true)
const loading = ref(false)
const showDialog = ref(false)

const data = reactive({
 tableColumns: [
   { label: "用户昵称", prop: "nickName", },
   { label: "真实姓名", prop: "realName" },
   { label: "性别", prop: "sex", slot: 'sex' },
   { label: "头像", prop: "avatar", slot: 'avatar' },
   { label: "手机号", prop: "tele" },
   { label: "省份", prop: "province" },
   { label: "城市", prop: "city" },
   { label: "地区", prop: "area" },
   { label: "状态",  prop: "status", slot: 'status'},
  //  { label: "操作",  prop: "opt", slot: 'opt'},
 ],
 queryColumns: [
   { label: '用户昵称', prop: 'nickName', type: 'input', attrs: { placeholder: '请输入用户昵称' } },
   { label: '手机号', prop: 'tele', type: 'input',  attrs: { placeholder: '请输入手机号' } },
   { label: '状态', prop: 'status', type: 'select', options: [{ label: "正常", value: 1 }, { label: "冻结", value: 0 }]}
 ],
})


/** 获取列表数据 */
const getList = () => {
  tableLoading.value = true
  getListApi(0)
   .then(res => {
   })
   .finally(() => {
       tableLoading.value = false
   })
}
getList()

/** 搜索按钮操作 */
const handleQuery = (val) => {
 queryParams.value = val
 getList()
}

const handlePagination = (val) => {
 pageParams.value = val
 getList()
}
const handleSubmit = async (data) => {
 loading.value = true
 try {
   // 这里调用API进行提交
   await saveUser(data)
   await new Promise(resolve => setTimeout(resolve, 1000))
   showDialog.value = false
   getList()
   proxy.$modal.msgSuccess("操作成功")
 } finally {
   loading.value = false
 }
}
const changeValue = (row) => {
 proxy.$modal.confirm(`是否确认${row.status === 1 ? '锁定' : '解锁'}此用户？`)
 .then(() => {
   saveUser({ id: row.id, account: row.account, status: row.status === 1 ? 2 : 1})
   .then(() => {
     proxy.$modal.msgSuccess("操作成功")
     getList()
   })
 })
}

</script>
<style lang="scss">
.app-user {
 padding: 8px;
}
</style>